<!--推文设置-->
<script setup lang="ts">

import {workEditData, Resolution, TypeList, StyleAndModels} from "~/data/ai/workeditdata";
import WorkEditInit from "~/components/ai/WorkEditInit.vue";
import WorkEditProjectHistory from "~/components/ai/WorkEditProjectHistory.vue";
import WorkEditActivate from "~/components/ai/WorkEditActivate.vue";
import {useTokenTweetAuth, useTokenTweetGetRemainDays, useTokenTweetSetTrialToken} from "~/utils/tokenUtils";
import DropSelect from "~/components/common/DropSelect.vue";
import DropSelctBase from "~/components/ai/DropSelctBase.vue";
import SelectDialogBase from "~/components/ai/SelectDialogBase.vue";
import ImageUpload from "~/components/ai/ImageUpload.vue";
import WorkEditVoiceModelSelect from "~/components/workedit/WorkEditVoiceModelSelect.vue";
import WorkEditMoreSetting from "~/components/workedit/WorkEditMoreSetting.vue";


//选中的风格
// const selectType = ref(0)
// watch(selectType, (newVal) => {
//   console.log("selectType",newVal)
// })

const uploadfile = ref()
const {
  cover_url,
  Resolution_id,
  ckpt_id,
  projectName,
  init_active,
  models,
  narrator_voice_id,
  voiceModels
} = storeToRefs(useWorkEditStore())
/**
 * 上传封面
 *
 */
const useWorkUplaodCover = async () => {
  console.log(uploadfile.value)
  const {useOss} = useStableDiffusionStore()
  if (!uploadfile.value) {
    useSnackbarStore().showErrorMessage('请上传封面')
    return
  }
  //如果没有启动OSS，则提示无法保存设置封面
  if (!useOss) {
    useSnackbarStore().showErrorMessage('没有启用OSS，无法保存封面！')
    return
  }
  const _cover = await useUtilsUploadFileToOSS(uploadfile.value[0].originFileObj, 'image')
  if (_cover) {
    cover_url.value = _cover
    useSnackbarStore().showSuccessMessage('设置封面成功')
  }
}



const handleSave = async () => {
  await JiangYing.saveProject()
  useSnackbarStore().showSuccessMessage('保存成功')
}


const tab = ref('new')

// 激活相关功能

const {user, tweetToken, lastShowTime, activate} = storeToRefs(useAuthStore())

//激活状态
const activate_status = ref(false)
const remainDays = ref(0)
remainDays.value = useTokenTweetGetRemainDays(tweetToken.value)//剩余天数

onMounted(() => {
  if (useTokenTweetAuth(user.value?._id!)) {
    //校验通过
    activate_status.value = true
  } else {
    console.log('校验不通过')
    //校验不通过，两种情况，第一种，第一次使用，添加一个临时key
    if (!tweetToken.value) {
      console.log('第一次使用，添加一个临时key')
      //添加一个临时key
      useTokenTweetSetTrialToken(user.value?._id!)
    }
    // activate.value = true
  }
})

</script>

<template>
  <v-container>
    <v-card>
      <v-card-title>
        <v-icon icon="mdi-cog-outline" class="mr-2"></v-icon>
        <v-card-title class="text-h5 font-weight-bold">基本设置</v-card-title>
        <v-spacer></v-spacer>
        <v-btn color="primary" size="small" rounded class="mx-2" @click="handleSave">
          <v-icon icon="mdi-content-save-check"></v-icon>
          保存项目
        </v-btn>
        <v-btn color="primary" size="small" rounded class="mx-2" @click="init_active=true">
          <v-icon icon="mdi-wrench-cog"></v-icon>
          初始化
        </v-btn>
        <v-btn color="primary" size="small" rounded class="mx-2" @click="activate=true">
          <v-icon icon="mdi-wrench-cog"></v-icon>
          激活
        </v-btn>
<!--        更多设置-->
        <work-edit-more-setting/>

      </v-card-title>
      <v-tabs
          v-model="tab"
          bg-color="primary"
      >
        <v-tab value="new">新项目</v-tab>
        <v-tab value="old">历史项目</v-tab>
      </v-tabs>

      <v-window v-model="tab">
        <v-window-item value="new">
          <v-card-text>
            <v-row>
              <v-col cols="12" md="6">
                <v-label class="text-caption font-weight-bold mb-2">项目名称</v-label>
                <v-text-field label="推文标题" placeholder="请输入推文标题" variant="outlined"
                              density="compact" v-model="projectName"></v-text-field>

                <v-label class="text-caption font-weight-bold mb-2">分辨率</v-label>
                <drop-selct-base v-model="Resolution_id" :options="Resolution" optionLabel="name"
                                 optionValue="id"></drop-selct-base>
                <!--                选择默认配音-->
                <v-label class="text-caption font-weight-bold mb-2">选择默认配音</v-label>
                <work-edit-voice-model-select/>
                <v-label class="text-caption font-weight-bold mb-2">风格</v-label>
                <v-divider/>
                <v-label>当前选择的的大模型为：{{ models[ckpt_id]?.name }}</v-label>
                <v-divider/>
                <!--            大模型机风格选择-->
                <select-dialog-base v-model="ckpt_id" :items="models" itemLabel="name" itemValue="ckpt_id" :categroies="TypeList" categoryLabel="name" categoryValue="id" />
                <v-divider/>
                <v-sheet>
                  <v-img class="mx-auto" max-height="300" width="50%" :src="models[ckpt_id]?.cover">

                  </v-img>
                </v-sheet>
              </v-col>
              <v-col cols="12" md="6">
                <v-card class="justify-center d-flex flex-column align-center">
                  <v-label class="mx-auto mb-2 text-h5 font-weight-bold text-center">项目封面</v-label>
                  <image-upload :src="cover_url" v-model:uploadfile="uploadfile" :height="400" :width="300"/>
                  <v-btn prepend-icon="mdi-content-save" class="show-btns mx-auto mb-2" variant="flat" color="primary"
                         text="上传封面"
                         @click="useWorkUplaodCover()">作为封面
                  </v-btn>
                </v-card>
              </v-col>
            </v-row>
          </v-card-text>

        </v-window-item>

        <v-window-item value="old">
          <work-edit-project-history/>
        </v-window-item>
      </v-window>

    </v-card>
  </v-container>

  <!--  初始化-->
  <work-edit-init v-model="init_active"/>
  <!--激活窗口-->
  <work-edit-activate v-model="activate"></work-edit-activate>

</template>

<style scoped lang="scss">

</style>